/***************************************************************************
 *   This is a part of the NextCAD Web APP.                                *
 *   Copyright (C) AMCAX, All rights reserved.                             *
 ***************************************************************************/

import { KEYBOARD_KEY } from '@app-cad/common/Constants';
import { PickableCommandForm } from '@app-cad/common/components/command-form/pickable';
import { wsApi } from '@app-cad/server';
import { RJSFSchema } from '@rjsf/utils';
import i18n from 'i18next';
import { useEffect, useState } from 'react';

import {
  BaseCommand,
  CENTEREVENTS,
  type CommandDialogPlacement,
} from '@amcax/base';
import { eventCenterManager } from '@app-base/common/events/EventCenterManager';
import { NumberInputFormat } from '@app-cad/common/components/command-form/constants';

// 楔形
interface WedgeCommandProps {
  title: string;
  onClose: () => void;
  placement: CommandDialogPlacement;
}

function WedgeCommand({ title, onClose }: WedgeCommandProps) {
  const [formData, setFormData] = useState({
    xmin: 0,
    xmax: 10,
    ymin: 0,
    ymax: 10,
    zmin: 0,
    zmax: 10,
    x2min: 2,
    x2max: 8,
    z2min: 2,
    z2max: 8,
  });

  useEffect(() => {
    eventCenterManager.activeEventCenter
      .setState('wedge')
      .on(CENTEREVENTS.KEYUP, onKeyUp)
      .addExit(exit);

    return exit;
  }, []);

  const handleExecute = async () => {
    await wsApi.createWedge(
      formData.xmin,
      formData.xmax,
      formData.ymin,
      formData.ymax,
      formData.zmin,
      formData.zmax,
      formData.x2min,
      formData.x2max,
      formData.z2min,
      formData.z2max,
    );
    onClose();
  };

  // const handleClose = () => {
  //   onClose();
  // };

  const exit = () => {
    eventCenterManager.activeEventCenter
      .off(CENTEREVENTS.KEYUP, onKeyUp)
      .setDefault();
    onClose();
  };

  const onKeyUp = (e) => {
    if (e.event.key === KEYBOARD_KEY.ESC) {
      exit();
    }
  };
  const schema: RJSFSchema = {
    properties: {
      xmin: {
        title: 'xmin',
        type: 'number',
        format: NumberInputFormat.Length,
      },
      xmax: {
        title: 'xmax',
        type: 'number',
        format: NumberInputFormat.Length,
      },
      ymin: {
        title: 'ymin',
        type: 'number',
        format: NumberInputFormat.Length,
      },
      ymax: {
        title: 'ymax',
        type: 'number',
        format: NumberInputFormat.Length,
      },
      zmin: {
        title: 'zmin',
        type: 'number',
        format: NumberInputFormat.Length,
      },
      zmax: {
        title: 'zmax',
        type: 'number',
        format: NumberInputFormat.Length,
      },
      x2min: {
        title: 'x2min',
        type: 'number',
        format: NumberInputFormat.Length,
      },
      x2max: {
        title: 'x2max',
        type: 'number',
        format: NumberInputFormat.Length,
      },
      z2min: {
        title: 'z2min',
        type: 'number',
        format: NumberInputFormat.Length,
      },
      z2max: {
        title: 'z2max',
        type: 'number',
        format: NumberInputFormat.Length,
      },
    },
  };
  return (
    <PickableCommandForm
      // isFormDataValid={finishValid}
      // disabled={initingEdit}
      onClose={onClose}
      title={title}
      schema={schema}
      formData={formData}
      submitText='完成'
      onChange={setFormData}
      onSubmit={handleExecute}
    />
  );
}

export const cmdWedge: BaseCommand = {
  id: 'CmdWedge',
  label: 'command.wedge',
  icon: 'commands/feature/wedge',
  create: (label: string, onClose: () => void) => (
    <WedgeCommand
      title={i18n.t(label)}
      onClose={onClose}
      placement='topLeft'
    />
  ),
};
